<%--
  Created by IntelliJ IDEA.
  User: xh
  Date: 2020/2/8
  Time: 19:50
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>bash运行脚本的几种方式 - 技术栈 -Java程序员成长平台</title>
    <meta name="keywords" content="">
    <meta name="description" content>
    <link rel="stylesheet" href="${APP_PATH}/vendor/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="${APP_PATH}/css/common.css">
    <link rel="stylesheet" href="${APP_PATH}/css/header.css">
    <link rel="stylesheet" href="${APP_PATH}/css/footer.css">
    <link rel="stylesheet" href="${APP_PATH}/css/blog-detail.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<jsp:include page="head.jsp"></jsp:include>

<!--
<div class="l-nav">
    <div class="l-blog-nav-header">
        <div class="l-blog-nav">
            <a href="" class="item">评论<i class="layui-icon layui-icon-reply-fill"></i></a>
            <a href="" class="item">收藏<i class="layui-icon layui-icon-rate"></i></a>
            <a href="" class="item">点赞<i class="layui-icon layui-icon-praise"></i></a>
            <a href="javascript:void(0);" class="item share">分享文章</a>
            <a href="" class="item">微博<i class="layui-icon layui-icon-login-weibo"></i></a>
            <a href="" class="item">Q Q<i class="layui-icon layui-icon-login-qq"></i></a>
            <a href="" class="item">微信<i class="layui-icon layui-icon-login-wechat"></i></a>
        </div>
    </div>
</div>
-->
<div class="layui-main g-main">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-xs9">
            <%--正文--%>
            <div class="layui-row ">
                <div class="layui-col-xs12 l-blog-content">
                    <div class="layui-tab-item layui-show l-blog-location-header">
                        <div class="layui-row">
                                   <span class="layui-breadcrumb">
                                      <a href="${APP_PATH}/blog/toBlog">${requestScope.blog.blogType}</a>
                                      <a href="${APP_PATH}/user/toUser-home-for-other?id=${requestScope.blog.userId}&userId=${sessionScope.user.id}">${requestScope.blog.blogInfo.user.username}</a>
                                      <a><cite>正文</cite></a>
                                    </span>
                        </div>
                        <div class="layui-row title">
                            <span class="layui-badge layui-bg-cyan c-mr3">顶</span>${requestScope.blog.title}
                        </div>
                        <div class="layui-row author">
                            <div class="item">
                                <a href="${APP_PATH}/user/toUser-home-for-other?id=${requestScope.blog.userId}" class="">
                                    <input type="hidden" value="${requestScope.blog.id}" id="blogId">
                                    <div class="user-img" title="${requestScope.blog.blogInfo.user.username}">
                                        <img src="https://oscimg.oschina.net/oscnet/up-2bc558d24f672ece9b22f407fa83b0f1.jpeg!/both/50x50?t=1506965633000" alt="吴伟祥" title="吴伟祥">
                                    </div>
                                    &nbsp;<span>${requestScope.blog.blogInfo.user.username}</span>
                                </a>
                                <span class="s-color-noclick">${requestScope.blog.sendTime}</span>
                            </div>
                            <div class="item">
                                <span><i class="layui-icon layui-icon-star s-color-noclick">&nbsp;10藏</i></span>
                            </div>
                            <div class="item">
                                <span><i class="layui-icon layui-icon-praise s-color-noclick">&nbsp;20赞</i></span>
                            </div>
                            <div class="item">
                                <span><i class="layui-icon layui-icon-reply-fill s-color-noclick">&nbsp;20评</i></span>
                            </div>
                            <div class="item">
                                        <span>
                                            <span><i class="layui-icon layui-icon-read s-color-noclick">&nbsp;10阅</i></span>
                                        </span>
                            </div>
                            <div class="item report">
                                <a href="javascript:;">
                                    <i class="layui-icon layui-icon-tips c-mr3">&nbsp;举报</i>
                                </a>
                            </div>
                        </div>
                        <div class="layui-row tag">
                            <span class="layui-badge layui-bg-gray c-mr3">Publish</span>
                            <span class="layui-badge layui-bg-gray c-mr3">Base</span>
                            <span class="layui-badge layui-bg-gray c-mr3">Java</span>
                        </div>
                        <div class="layui-row content">
                            <div class="content-article">
                                <p>${requestScope.blog.main}
                                </p>
                                <pre><code class="hljs">/data/shell/hello.sh</code></pre>
                            </div>
                        </div>
                        <%--点赞收藏--%>
                        <div class="layui-row operation">
                            <c:if test="${requestScope.good==0}">
                                <a href="javascript:void(0);" onclick="goodAdd();" class="layui-btn layui-btn-lg"><i class="layui-icon layui-icon-praise"></i> 点赞(<font id="goodTotal">${requestScope.goodTotal}</font>) </a>
                            </c:if>
                            <c:if test="${requestScope.good!=0}">
                                <a href="javascript:void(0);" onclick="goodAdd();" class="layui-btn layui-btn-lg "><i class="layui-icon layui-icon-praise"></i> 已点赞(<font>${requestScope.goodTotal}</font>) </a>
                            </c:if>

                            <c:if test="${requestScope.collection==0}">
                                <a href="javascript:void(0);" onclick="collect();" class="layui-btn layui-btn-primary layui-btn-lg"><i class="layui-icon layui-icon-star"></i> 收藏 (<font id="collectionTotal">${requestScope.collectionTotal}</font>)</a>
                            </c:if>
                            <c:if test="${requestScope.collection!=0}">
                                <a href="javascript:void(0);" onclick="collect();" class="layui-btn layui-btn-primary layui-btn-lg"><i class="layui-icon layui-icon-star"></i> 已收藏 (<font >${requestScope.collectionTotal}</font>)</a>
                            </c:if>

                        </div>

                        <div class="layui-row bottom">
                           <c:choose>
                               <c:when test="${empty requestScope.frontBlog}">
                                   <div class="layui-col-xs6 layui-elip">
                                       上一篇：
                                       <a href="#" title="没有上一篇">没有上一篇</a>
                                   </div>
                                   <div class="layui-col-xs6 layui-elip">
                                   下一篇：
                                   <a href="${APP_PATH}/blog/toBlog-detail?id=${requestScope.behindBlog.id}" title="${requestScope.behindBlog.title}">${requestScope.behindBlog.title}</a>
                               </div>
                               </c:when>
                               <c:when test="${empty requestScope.behindBlog}">
                                   <div class="layui-col-xs6 layui-elip">
                                       上一篇：
                                       <a href="${APP_PATH}/blog/toBlog-detail?id=${requestScope.frontBlog.id}" title="${requestScope.frontBlog.title}">${requestScope.frontBlog.title}</a>
                                   </div>
                                   <div class="layui-col-xs6 layui-elip">
                                       下一篇：
                                       <a href="#" title="没有下一篇">没有下一篇</a>
                                   </div>
                               </c:when>
                               <c:otherwise>
                                   <div class="layui-col-xs6 layui-elip">
                                       上一篇：
                                       <a href="${APP_PATH}/blog/toBlog-detail?id=${requestScope.frontBlog.id}" title="${requestScope.frontBlog.title}">${requestScope.frontBlog.title}</a>
                                   </div>
                                   <div class="layui-col-xs6 layui-elip">
                                       下一篇：
                                       <a href="${APP_PATH}/blog/toBlog-detail?id=${requestScope.behindBlog.id}" title="${requestScope.behindBlog.title}">${requestScope.behindBlog.title}</a>
                                   </div>
                               </c:otherwise>
                           </c:choose>
                        </div>

                    </div>
                </div>
            </div>
            <hr>
            <div class="l-blog-comment">
                <blockquote class="layui-elem-quote layui-quote-nm"><b>共${requestScope.commentSize}条评论</b> </blockquote>
                <div>
                    <div id="j-temp-replay" class="layui-show">
                    <c:forEach items="${requestScope.comments}" var="comment">
                    <div  class="layui-row item">
                            <div class="layui-col-xs1 item-img">
                                <img src="${APP_PATH}/img/1.png" width="100%">
                            </div>
                            <div class="layui-col-xs11 item-com">
                                <div class="item-head">
                                    <a href="${APP_PATH}/user/toUser-home-for-other?id=${comment.userId}">${comment.commentInfo.user.username}&nbsp;
                                        <c:if test="${comment.userId==requestScope.blog.userId}">
                                            <span class="layui-badge layui-bg-gray">作者</span>
                                        </c:if>

                                    </a>
                                    <span></span>
                                    <span>${comment.sendTime}</span>
                                    <i class="layui-icon layui-icon-tips"></i>
                                    <i class="layui-icon layui-icon-delete"></i>
                                </div>
                                <div class="item-content">
                                    ${comment.main}
                                </div>
                                <div class="item-btn">
                                    <span class="j-reply">回复</span>
                                </div>
                                <div class="item-comment">
                                    <div class="j-comment">
                                    </div>
                                </div>
                                <div class="item-reply">
                                    <div class="layui-col-space20 layui-row item-form">
                                        <div class="layui-col-xs10"><textarea type="text" placeholder="文明社会，理性评论"></textarea></div>
                                        <div class="layui-col-xs1"><button class="layui-btn layui-btn-primary">添加回复</button></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                    </div>
                    <div class="j-user" data-user-head="img/photo.jpg" data-user-name="Destiny" data-user-id="_124680oic"></div>
                </div>
            <div class="layui-row l-blog-comment-input">
                <div class="title">发表评论</div>
                <form id="commentForm" action="${APP_PATH}/comment/doinput" method="post">
                <div class="input-content">
                    <input name="userId" id="userId" type="hidden" value="${sessionScope.user.id}">
                    <input name="forwardId" id="forwardId" type="hidden" value="${requestScope.blog.id}">
                    <textarea name="main" id="commentMain" placeholder="文明社会，理性评论" class="layui-textarea j-reply-textarea"></textarea>
                </div>
            </form>
                <div class="operation">
                    <button class="layui-btn" onclick="comment();">立即发表</button>
                </div>
            </div>
            <div class="layui-row l-blog-con-article  layui-tab layui-tab-brief ">
                <ul class="layui-tab-title">
                    <li class="layui-this">相关文章</li>
                    <!-- <li >最新文章</li>-->
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <div class="l-blogs-list-body">
                            <div class="layui-row">
                                <div class="layui-col-xs10 l-blog">
                                    <div class="title layui-elip">
                                        <a href="" title="后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？">
                                            <span class="layui-badge layui-bg-cyan c-mr3">顶</span>后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？
                                        </a>
                                    </div>
                                    <!-- 需要通过JS处理多行溢出内容,显示最多为2排-->
                                    <div class="content imitate_ellipsis">后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？</div>
                                    <div class="footer">
                                        <a href="" class="label">
                                            <span class="layui-badge layui-bg-gray">Java核心技术</span>
                                        </a>
                                        <a href="" class="label">
                                            <span class="layui-badge layui-bg-gray">Java WEB</span>
                                        </a>
                                        <a href="" class="label">谭江海</a>
                                        <span class="label time">昨天 22:59</span>
                                        <span class="label">
                                                    <span><i class="layui-icon layui-icon-praise s-color-noclick">&nbsp;${requestScope.goodTotal}赞</i></span>
                                                </span>
                                        <a href="" class="label">
                                            <span><i class="layui-icon layui-icon-reply-fill">&nbsp;20评</i></span>
                                        </a>
                                        <span class="label">
                                                    <span><i class="layui-icon layui-icon-read">&nbsp;10阅</i></span>
                                                </span>
                                    </div>
                                </div>
                                <div class="layui-col-xs2 l-blog-img">
                                    <a href="" class="image">
                                        <img src="https://oscimg.oschina.net/oscnet/0f0005fc1e845f25532918855e9cb4129e9.jpg"  style="width: 100%; height: auto;">
                                    </a>
                                </div>
                            </div>
                            <div class="layui-row">
                                <div class="layui-col-xs12 l-blog">
                                    <div class="title layui-elip">
                                        <a href="" title="后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？">
                                            <span class="layui-badge layui-bg-cyan c-mr3">顶</span>后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？
                                        </a>
                                    </div>
                                    <!-- 需要通过JS处理多行溢出内容,显示最多为2排-->
                                    <div class="content imitate_ellipsis">后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？后台使用MultipartFile上传文件，现在可能对文件进行修改并实现下载， 希望在一个请求中完成，如何实现？</div>
                                    <div class="footer">
                                        <a href="" class="label">
                                            <span class="layui-badge layui-bg-gray">Java核心技术</span>
                                        </a>
                                        <a href="" class="label">
                                            <span class="layui-badge layui-bg-gray">Java WEB</span>
                                        </a>
                                        <a href="" class="label">谭江海</a>
                                        <span class="label time">昨天 22:59</span>
                                        <span class="label">
                                                    <span><i class="layui-icon layui-icon-praise s-color-noclick">&nbsp;20赞</i></span>
                                                </span>
                                        <a href="" class="label">
                                            <span><i class="layui-icon layui-icon-reply-fill">&nbsp;20评</i></span>
                                        </a>
                                        <span class="label">
                                                    <span><i class="layui-icon layui-icon-read">&nbsp;10阅</i></span>
                                                </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</div>
            <jsp:include page="right/right.jsp"></jsp:include>
    </div>
</div>

<div class="g-footer">
    <hr>
    <div>Copyright ©2018 技术栈(jishuzhan.club), All Rights Reserved.</div>
    <div>渝ICP备13001123号-2</div>
</div>

<script src="${APP_PATH}/vendor/holder.min.js"></script>
<script src="${APP_PATH}/vendor/layui-v2.4.5/layui/layui.js"></script>
<script src="${APP_PATH}/js/common.js"></script>
<script src="${APP_PATH}/js/blog-detail.js"></script>
<script src="${APP_PATH}/js/report.js"></script>
<script src="${APP_PATH}/jquery/jquery-2.1.1.min.js"></script>
<script>
    function comment() {
        var userId=$("#userId").val();
        var forwardId=$("#forwardId").val();
       var main=$("#commentMain").val();


       if (main==''){
           layer.msg("评论内容不能为空", {time: 3000, icon: 5, shift: 6}, null);
           return;
       }

        var loadingIndex = null;
       $.ajax({
           url : "${APP_PATH}/comment/doAjaxComment",
           method : 'POST',
           data : {
               userId : userId,
               forwardId:forwardId,
               main:main
           },success : function ( result ){
               if( result.success ){
                   layer.msg("成功！", {time: 2000, icon: 6, shift: 4}, function(){
                       var comment = result.data;
                       var commentContent = "";
                      commentContent += '<div  class="layui-row item">';
                           commentContent += '<div class="layui-col-xs1 item-img">';
                           commentContent += '<img src="${APP_PATH}/img/1.png" width="100%">';
                           commentContent += '</div>';
                           commentContent += '<div class="layui-col-xs11 item-com">';
                          commentContent += ' <div class="item-head">';
                          commentContent += ' <a href="${APP_PATH}/user/toUser-home-for-other?id='+comment.id+'">'+comment.commentInfo.user.username+'&nbsp;';
                          commentContent += ' </a>';
                          commentContent += ' <span></span>';
                           commentContent += '<span class="label time">'+comment.sendTime+'</span>';
                           commentContent += '<i class="layui-icon layui-icon-tips"></i>';
                          commentContent += ' <i class="layui-icon layui-icon-delete"></i>';
                          commentContent += ' </div>';
                          commentContent += ' <div class="item-content">';
                         commentContent += '  '+comment.main+'';
                         commentContent += '  </div>';
                         commentContent += '  <div class="item-btn">';
                         commentContent += '  <span class="j-reply">回复</span>';
                        commentContent += '   </div>';
                         commentContent += '  <div class="item-comment">';
                         commentContent += '  <div class="j-comment">';
                       commentContent += '    </div>';
                       commentContent += '  </div>';
                       commentContent += '  <div class="item-reply">';
                       commentContent += '  <div class="layui-col-space20 layui-row item-form">';
                       commentContent += ' <div class="layui-col-xs10"><textarea type="text" placeholder="文明社会，理性评论"></textarea></div>';
                       commentContent += ' <div class="layui-col-xs1"><button class="layui-btn layui-btn-primary">添加回复</button></div>';
                       commentContent += ' </div>';
                       commentContent += '  </div>';
                       commentContent += '  </div>';
                       commentContent += '  </div>';

                       $("#j-temp-replay").html(commentContent);
                   });
               } else {
                   layer.msg("失败！", {time: 3000, icon: 5, shift: 6}, null);
               }
           }, complete : function(){
               layer.close(loadingIndex);
           }

       });
    }

    function goodAdd() {
        var blogId=$("#blogId").val();
        var userId=$("#userId").val();
        var goodTotal=$("#goodTotal");

        var loadingIndex = null;

        $.ajax({
            url : "${APP_PATH}/blog/goodAdd",
            method : 'POST',
            data:{
                userId:userId,
                blogId:blogId

            }, success : function ( result ){
                if( result.success ){
                    goodTotal.html(parseInt(goodTotal.html())+1);
                    layer.msg("点赞成功", {time: 1000, icon: 6, shift: 4},null);
                } else {
                    layer.msg("您已经点过赞了", {time: 3000, icon: 5, shift: 6}, null);
                }
            }, complete : function(){
                layer.close(loadingIndex);
            }

        });

    }

    function collect() {
        var blogId=$("#blogId").val();
        var userId=$("#userId").val();
        var collectionTotal=$("#collectionTotal");
        layer.confirm("你确定要收藏吗？", {icon: 3, title: '提示'}, function (cindex) {

            // 将ids传入后台进行批量删除
            var loadingIndex = null;
            $.ajax({
                url: "${APP_PATH}/blog/collect",
                method: "POST",
                data: {
                    blogId:blogId,
                    userId:userId
                },
                success: function (result) {
                    if (result.success) {
                        collectionTotal.html(parseInt(collectionTotal.html())+1);
                        layer.msg("收藏成功！", {time: 3000, icon: 6, shift: 2}, function () {
                            // 重新查询数据
                        });
                    } else {
                        layer.msg("收藏失败！", {time: 3000, icon: 5, shift: 6}, null);
                    }
                },
                complete: function () {
                    layer.close(loadingIndex);
                }
            });

            layer.close(cindex);
        }, function (cindex) {
            layer.close(cindex);
        });
    }
</script>
</body>
</html>
